<template>
  <div>
    <p>
      <a href="https://github.com/hinesboy/mavonEditor">
        mavon-editor
      </a>基于Vue的markdown编辑器
    </p>
    <div class="mavonEditor">
      <mavon-editor :toolbars="markdownOption" v-model="handbook"/>
    </div>
  </div>
</template>

<script>
export default {
  name: "TestMarkDownEditor",
  data() {
    return {
      //markdownOption编辑器菜单
      markdownOption: {
        bold: true, // 粗体

      },
      handbook: "#### how to use mavonEditor in nuxt.js"
    };
  }
}
</script>

<style scoped>
.mavonEditor {
  width: 100%;
  height: 100%;
}
</style>
